<template>
  <div>
    <el-table ref="multipleTable" :data="tableData" border size="mini" style="width: 100%"
              tooltip-effect="dark" @selection-change="handleSelectionChange" stripe>
      <el-table-column align="center" type="selection" width="55">
      </el-table-column>
      <el-table-column align="center" label="活动名称">
        <template slot-scope="scope">
          <span>{{ scope.row.eventName }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="创始人id">
        <template slot-scope="scope">
          <span>{{ scope.row.proprieterId }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="所属社团id">
        <template slot-scope="scope">
          <span>{{ scope.row.organizationId }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动类型">
        <template slot-scope="scope">
          <span>{{ scope.row.type }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动信息" width="150">
        <template slot-scope="scope">
          <el-popover
              placement="bottom"
              width="200"
              trigger="click"
              :content="scope.row.introduce">
            <el-button slot="reference" type="primary" plain>活动信息</el-button>
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column align="center" label="图片id">
        <template slot-scope="scope">
          <span>{{ scope.row.imgId }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="最大限制人数">
        <template slot-scope="scope">
          <span>{{ scope.row.peopleNumber }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="是否签到">
        <template slot-scope="scope">
          <el-tag v-show="scope.row.signIn" size="mini">{{ scope.row.signIn }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" label="开始时间">
        <template slot-scope="scope">
          <span>{{ scope.row.startTime }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="结束时间">
        <template slot-scope="scope">
          <span>{{ scope.row.endTime }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动主题">
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动地点">
        <template slot-scope="scope">
          <span>{{ scope.row.address }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动所属部门">
        <template slot-scope="scope">
          <span>{{ scope.row.department }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作" prpo="right" width="200">
        <template slot-scope="scope">
          <el-button type="success" icon="el-icon-check" @click="examinePass(scope.row)" round></el-button>
          <el-button type="danger" icon="el-icon-close" @click="examineFail(scope.row)" round></el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="text-align:center">
      <h1></h1>
      <el-pagination :page-size="100" :page-sizes="[8, 16, 24, 32]"
                     :total="total" layout="total, sizes, prev, pager, next, jumper"
                     @size-change="handleSizeChange" @current-change="handleCurrentChange">
      </el-pagination>
    </div>
  </div>
</template>

<script>
import {listEvent, totalEvent, deleteEvent, selectEvent, updateEvent, sendMsg} from "@/api/eventServer";

export default {
  data() {
    return {
      isSelected: false, // 当前是否查询
      selectForm: {
        current: 0,
        size: 10,
        isPending: "pending"
      }, // 查询用的临时表单
      pageSize: 8, // 每页数据量
      currpage: 1, // 当前页码
      total: 0, // 表格数据总条数
      multipleSelection: [], // 存放当前选中的数据
      tableData: [],  // 存放表格数据
      msgData: {
        "msg": '',
        "userId": 0,
      }
    }
  },
  mounted() {
    this.total = this.tableData.length;
    this.$bus.$on('eventUpDataTable', this.upData)      // 显示更新表格
    this.upData(); //需要触发的函数
    console.log(this.selectForm);
  },
  methods: {
    //审核通过
    examinePass(val) {
      this.$confirm('你确定要通过审核吗', '进行提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        val.statu = 1
        console.log(val)
        updateEvent(val).then(response => {
          // this.upData()
          this.upData()
          console.log(response.data)
          this.msgData.msg = "您发布的" + val.eventName + "已审核通过"
          this.msgData.userId = val.proprieterId
          sendMsg(this.msgData)


        })
      })

    },
    //审核不通过(审核不通过的活动删除)
    examineFail(val) {
      // console.log(val);
      deleteEvent({"id": val.id}).then(response => {
        // this.upData()
        this.msgData.msg = "您发布的" + val.eventName + "审核未通过"
        this.msgData.userId = val.proprieterId
        sendMsg(this.msgData)
      })
    },
    // 更新表格数据
    upData() {
      this.selectForm['current'] = this.currpage
      this.selectForm['size'] = this.pageSize
      this.selectForm['statu'] = 0
      if (this.isSelected) {
        selectEvent(this.selectForm).then(response => {
          this.total = Number(response.data.msg);
          this.tableData = response.data.data;
        });
      } else {
        listEvent(this.selectForm).then(response => {
          this.total = Number(response.data.msg);
          this.tableData = response.data.data;
        });
      }
    },
    // 表格内容选中时调用的函数
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 表格修改每页大小时调用的函数
    handleSizeChange(val) {
      this.pageSize = val;
      this.upData();
    },
    // 表格换页时调用的函数
    handleCurrentChange(val) {
      this.currpage = val;
      this.upData();
    },
  }
}
</script>

<style>
</style>
